<template>
    <div>
      <h1>比较两个数字的大小</h1>
      <label for="input1">请输入第一个数字</label><br>
<input id="input1" type="number" v-model.number="number1" placeholder="请输入第一个数字"><br>

<label for="input2">请输入第二个数字</label><br>
<input id="input2" type="number" v-model.number="number2" placeholder="请输入第二个数字"><br>
<button @click="compareNumbers">比较</button>
      <p v-if="result !== null">较大的数字是：{{ result }}</p>
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        number1: null,
        number2: null,
        result: null
      };
    },
    methods: {
      compareNumbers() {
        if (this.number1 === null || this.number2 === null) {
          alert('请输入两个数字');
          return;
        }
        
        if (this.number1 > this.number2) {
          this.result = this.number1;
        } else if (this.number1 < this.number2) {
          this.result = this.number2;
        } else {
          this.result = '两个数字相等';
        }
      }
    }
  };
  </script>
  
  <style scoped>
  /* 可以添加一些样式 */
  </style>